<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Kafka performance report</title>
    
    
    <!-- 1. Add these JavaScript inclusions in the head of your page -->
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
    <script type="text/javascript" src="./js/highcharts.js"></script>
    <script type="text/javascript" src="./js/exporting.js"></script>

    <script type="text/javascript" src="./js/kafka.js"></script>

    <!-- 2. Add the JavaScript to initialize the chart on document ready -->
    <script type="text/javascript">
      function getParameterByName( name )
      {
      name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
      var regexS = "[\\?&]"+name+"=([^&#]*)";
      var regex = new RegExp( regexS );
      var results = regex.exec( window.location.href );
      if( results == null )
      return "";
      else
      return decodeURIComponent(results[1].replace(/\+/g, " "));
      }
      var dataDir = getParameterByName("dataDir") ? getParameterByName("dataDir") : "data";
      console.log(dataDir);
      $(document).ready(function()
       {
        kafkagraph('container1', 'MB of data produced/consumed', './' + dataDir + '/MBdata.csv', 'MB of data');
        kafkagraph('container2', 'Number of messages  produced/consumed', './' + dataDir + '/NumMessage.csv', 'Number of messages');
      });
    </script>

    </head>
    <body>
      <div id="container1" style="width: 800px; height: 400px; margin: 0 auto"></div>
      <p> <p> <br> <br> <br>
       <div id="container2" style="width: 800px; height: 400px; margin: 0 auto"></div>
    </body>
</html>
